<template>
  <view class="content">
    <up-navbar title="我的" @rightClick="backClick" :autoBack="true">
    </up-navbar>
    <view class="user-info gradient-box">
      <up-avatar :size="80" :src="userInfo.avatar"></up-avatar>
      <view class="user-detail">
        <text class="user-name">学生小明</text>
        <text class="user-id">ID: 123456</text>
      </view>
    </view>
    <up-cell-group>
      <up-cell icon="setting-fill" title="个人设置"></up-cell>
      <up-cell icon="integral-fill" title="会员等级" value="新版本"></up-cell>
      <!-- 学校管理入口 -->
      <up-cell icon="map-fill" title="学校管理" @click="navigateToSchoolAdmin"></up-cell>
      <!-- 新增课程管理入口 -->
      <up-cell icon="bookmark-fill" title="课程管理" @click="navigateToCourseAdmin"></up-cell>
    </up-cell-group>

    <view class="one-button-container">
      <up-button type="primary" @click="logout" class="logout-btn"
        >退出登录</up-button
      >
    </view>
    <my-tabbar :currentIndex="currentIndex"></my-tabbar>
  </view>
</template>

<script>
export default {
  data() {
    return {
      currentIndex: 2,
      userInfo: {
        name: "学生小明",
        avatar: "https://picsum.photos/seed/student/100/100",
        studentId: "123456",
      },
    };
  },
  methods: {
    backClick() {
      uni.navigateBack();
    },
    navigateToMyCourses() {
      uni.navigateTo({
        url: "/pages/my-courses/my-courses",
      });
    },
    navigateToStudyRecords() {
      uni.navigateTo({
        url: "/pages/study-records/study-records",
      });
    },
    navigateToFavorites() {
      uni.navigateTo({
        url: "/pages/favorites/favorites",
      });
    },
    navigateToSettings() {
      uni.navigateTo({
        url: "/pages/settings/settings",
      });
    },
    // 学校管理跳转方法
    navigateToSchoolAdmin() {
      uni.navigateTo({
        url: "/pages/admin/school-management",
      });
    },
    // 新增课程管理跳转方法
    navigateToCourseAdmin() {
      uni.navigateTo({
        url: "/pages/course/course-management", // 跳转至课程管理页面
      });
    },
    logout() {
      uni.showModal({
        title: "确认退出",
        content: "你确定要退出当前账号吗？",
        success: (res) => {
          if (res.confirm) {
            // 处理退出逻辑
            uni.clearStorageSync();
            uni.reLaunch({
              url: "/pages/user/login",
            });
          }
        },
      });
    },
  },
};
</script>

<style lang="scss">
.user-info {
  padding: 30px 15px;
  display: flex;
  align-items: center;
  color: white;
}

.user-detail {
  margin-left: 15px;
}

.user-name {
  font-size: 18px;
  font-weight: 600;
  display: block;
  margin-bottom: 5px;
}

.user-id {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
}

.logout-btn {
  flex: 1;
}
</style>